import React from 'react';
import Form, { FormComponentProps } from 'antd/lib/form/Form';
import Item from './Item'
import Input from './Input'
import Select from './Select'
import Switch from './Switch'
import Radio from './Radio'
import Check from './Check'
import DatePicker from './DatePicker'
import TimePicker from './TimePicker'
import Cascader from './Cascader'
import Text from './Text'
import moment from 'moment'

export interface IFormProps extends FormComponentProps {
	model: object,
	onSubmit: (model: object) => void,

}

export const FormContext = React.createContext<IFormProps>({} as IFormProps);

class MyForm extends React.Component<IFormProps, any> {

	handleSubmit = (e: React.TouchEvent) => {
		e.preventDefault();
		let { form, onSubmit, model } = this.props;
		form.validateFieldsAndScroll((err: any, values: any) => {
			if (!err) {
				console.log("表单校验成功后的数据：", values);
				const formData = form.getFieldsValue();
				console.log("表单数据：", formData);

				model = { ...model, ...formData }
				// console.log(JSON.stringify(model) )
				onSubmit(model);
			}
		});
	}

	render() {
		const { children } = this.props;
		return (
			<FormContext.Provider value={this.props}>
				<Form onSubmit={this.handleSubmit} >{children}</Form>
			</FormContext.Provider>

		)
	}
	static Item = Item
	static Input = Input
	static Select = Select
	static Switch = Switch
	static Radio = Radio
	static Check = Check
	static DatePicker = DatePicker
	static TimePicker = TimePicker
	static Cascader = Cascader
	static Text = Text



}

export default Form.create<IFormProps>()(MyForm)